<template>
  <div>
    <div class="mb10">
      <a-textarea :rows="4" v-model.trim="comment" placeholder="请发表您的看法"></a-textarea>
      <div class="tar"><a-button type="" class="mt10 mb10" @click="replyFirst">发表评论</a-button></div>
      <ZgReply :objType="objType" :list="list"></ZgReply>
      <a-pagination v-show="total > 0" :total="total" :pageSizeInit="pageSize" @change="onPageChange"></a-pagination>
    </div>
  </div>
</template>

<script>
export default {
  props: {
    objType: {
      type: String,
      default: 'default'
    },
    objKey: {
      type: String,
      default: '0'
    }
  },
  data () {
    return {
      topicId: '0',
      list: [],
      comment: '',
      total: 0,
      page: 1,
      pageSize: 10
    }
  },
  mounted () {
    this.search()
  },
  watch: {
    objType () {
      this.search()
    },
    objKey () {
      this.search()
    }
  },
  methods: {
    onPageChange (p) {
      this.page = p.page
      this.pageSize = p.pageSize
      this.search()
    },
    findFirstLayer () {
      this.$http.get('/zg-system/reply/first/page', {
        topicId: this.topicId,
        page: this.page,
        pageSize: this.pageSize
      }, data => {
        this.total = parseInt(data.total)
        this.list = data.records.map(t => {
          t.page = 1
          t.children = []
          t.showChild = false
          return t
        })
      })
    },
    search () {
      this.$http.post('/zg-system/reply/topic', {
        objType: this.objType,
        objKey: this.objKey
      }, data => {
        this.topicId = data.id
        this.findFirstLayer()
      })
    },
    replyFirst () {
      this.needLogin(() => {
        if (this.topicId === '0') {
          this.$warning({ title: '请设置主题' })
          return
        }
        if (this.comment.length === 0) {
          this.$warning({ title: '请输入评论内容' })
          return
        }
        this.$http.post('/zg-system/reply/first/add', {
          replyId: this.topicId,
          content: this.comment
        }, () => {
          this.search()
          this.comment = null
        })
      })
    }
  }
}
</script>
<style lang="less" scoped>
</style>
